<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>测试ajax提交数据并入库</title>

    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script>
        function fun(){
            $.ajax({
                type: "get" , //要使用的请求方式
                url:"http://localhost:8090/car/save" , //要访问的服务器程序
                data: {  //请求参数
                    "id":"10",
                    "name":"BMW",
                    "price":"9.9"
                },
                //需要跨域@CrossOrigin
                success: function(data){ //成功时的方案
                    console.log(data);
                    console.log(data.id);
                    alert(100);
                }
            })
        }
    </script>
</head>
<body>

<a onclick="fun();" href="#">点我提交数据</a>

</body>
</html>


<!--一、为什么会出现跨域问题-->
<!--出于浏览器的同源策略限制。同源策略（Sameoriginpolicy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源（即指在同一个域）就是两个页面具有相同的协议（protocol），主机（host）和端口号（port）-->

<!--二、什么是跨域-->
<!--当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域-->

<!--当前页面url	被请求页面url	是否跨域	原因-->
<!--http://www.test.com/	http://www.test.com/index.html	否	同源（协议、域名、端口号相同）-->
<!--http://www.test.com/	https://www.test.com/index.html	跨域	协议不同（http/https）-->
<!--http://www.test.com/	http://www.baidu.com/	跨域	主域名不同（test/baidu）-->
<!--http://www.test.com/	http://blog.test.com/	跨域	子域名不同（www/blog）-->
<!--http://www.test.com:8080/	http://www.test.com:7001/	跨域	端口号不同（8080/7001）-->
<!--————————————————-->
